<template>
  <div class="mt-[30px]">
    <div class="flex items-center mb-[30px]">
      <!-- title -->
      <div class="min-w-[100px] title">
        <slot name="title"> </slot>
      </div>

      <!-- line -->
      <div class="line w-full mx-[30px]"></div>

      <!-- page -->
      <div class="text-[#7b7b7b] text-[11px] font-[600]">
        <slot name="page"> </slot>
      </div>
    </div>

    <slot />
  </div>
</template>

<style lang="less" scoped>
.title {
  color: #7c7d7d;
  font-size: 1.25rem;
  font-weight: 700;
  -webkit-box-reflect: below -5px linear-gradient(transparent, rgba(0, 0, 0, 0.4));
}

.line {
  border-bottom: 2px dotted rgba(225, 225, 235, 0.9);
}
</style>
